/*
 * @Description: 触发条件设定
 * @Author: Zzt
 * @Date: 2022-08-15 19:25:57
 * @LastEditTime: 2022-08-16 14:07:23
 */

import { Checkbox, Form, FormInstance, Input, Radio, RadioChangeEvent, Select } from 'antd';

const { TextArea } = Input;
const { Option } = Select;
interface ITriggerConditionProps {
  form: FormInstance;
  visible: any;
  closeDialog: any;
}
const handleChange = (value: string) => {
  console.log(`selected ${value}`);
};
const after = ['档案移入/增加后', '处置完成后', '档案修改后', '档案删除后'];
const timeTrigger = (
  <>
    <Form.Item name="time" label="检测时间">
      <Radio.Group>
        <Radio value={1}>不开启</Radio>
        <Radio value={2}>开启</Radio>
      </Radio.Group>
      <Select defaultValue="1" onChange={handleChange}>
        <Option value="1">每隔5秒执行一次</Option>
        <Option value="2">每隔1分钟执行一次</Option>
        <Option value="3">每天5-15点整点触发</Option>
        <Option value="4">每天下午2点到下一2：50期间的每1分钟触发</Option>
      </Select>
    </Form.Item>
    <Form.Item name="remarks" label="备注">
      <TextArea rows={4} />
    </Form.Item>
  </>
);
const eventTrigger = (
  <>
    <Form.Item label="请选择事件">
      <Radio.Group>
        <Radio value={1}>不开启</Radio>
        <Radio value={2}>档案发生变化时</Radio>
      </Radio.Group>
      <Checkbox.Group options={after}></Checkbox.Group>
    </Form.Item>
  </>
);
const customTrigger = (
  <>
    <Form.Item label="请编写表达式" rules={[{ required: true }]}>
      <Radio.Group>
        <Radio value={1}>不开启</Radio>
        <Radio value={2}>开启</Radio>
      </Radio.Group>
      <TextArea rows={4} />
    </Form.Item>
  </>
);
const onChange = (ev: RadioChangeEvent) => {
  console.log('radio checked', ev.target.value);
};

const TriggerCondition = (props: ITriggerConditionProps) => {
  return (
    <>
      <Form labelCol={{ span: 5 }} wrapperCol={{ span: 16 }}>
        <Form.Item
          name="mode"
          label="备份方式"
          rules={[{ required: true }]}
          extra="系统监控时间到期时，触发鉴定"
        >
          <Radio.Group onChange={onChange}>
            <Radio value={1}>时间触发</Radio>
            <Radio value={2}>事件触发</Radio>
            <Radio value={3}>自定义触发</Radio>
          </Radio.Group>
        </Form.Item>
        <Form.Item
          noStyle
          shouldUpdate={(prevValues, curValues) => prevValues.mode !== curValues.mode}
        >
          {({ getFieldValue }) =>
            getFieldValue('mode') === 3
              ? customTrigger
              : getFieldValue('mode') === 2
              ? eventTrigger
              : timeTrigger
          }
        </Form.Item>
      </Form>
    </>
  );
};
export default TriggerCondition;
